<template>
    <view class="xilu">
        <view class="page-foot" @click="bindFreight()">
            <view class="btn1">确定提交</view>
        </view>
       <view class="container plr40">
          
		   <view class="pt40 flex-box flex-between">
			   <view class="fs30 col5">物流公司</view>
			   <multi-select :items="expressCompany" @change="bindCompanyChange" id_key="id"
			   	name_key="name" children_key="childlist" :value="express_company_id"
			   	ref="pickers">
			   	<view class="inp_item flex-box m-arrow-right">
			   		<view class="flex-grow-1 fs30 col89" v-if="!selectedExpress">请选择</view>
			   		<view class="flex-grow-1 fs30 col1" v-else> {{selectedExpress.name}}
			   		</view>
			   		</image>
			   	</view>
			   </multi-select>
		   </view>
           <view class="pt40 flex-box flex-between">
               <view class="fs30 col5">物流单号</view>
               <input type="text" class="flex-grow-1 tr fs30" v-model="express_no" placeholder="请输入">
           </view>
       </view>
    </view>
</template>

<script>
	import multiSelect from '@/components/multi-select/multi-select.vue';
	var validate = require("../../xilu/validate.js");
    export default {
		components: {
		    multiSelect
		},
        data() {
            return {
				expressCompany:[],
				selectedExpress:null,
                order:{},
				express_company_id:0,
				express_no:''
            };
        },
		onLoad() {
			let page = this;
			page.fetchExpressCompany();
			this.getOpenerEventChannel().on('freightTransfor',function(order){
				page.order = order;
				
			})
			
		},
		methods:{
			fetchExpressCompany(){
				this.$core.post({url: 'xilumarket.order/express_company',data: {},loading: false,success: ret => {
					this.expressCompany = ret.data;
				}
				})
			},
			//物流公司
			bindCompanyChange(e) {
				let index = e.indexValues;
				this.express_company_id = this.expressCompany[index[0]].id;
				this.selectedExpress = {
					id: this.express_company_id,
					'name': this.expressCompany[index[0]].name
				};
			},
			bindFreight(){
				let order = this.order;
				let data = {
					aftersale_id: order.aftersale.id,
					express_company_id: this.express_company_id,
					express_no: this.express_no
				}
				var rule = [
					{name: 'aftersale_id',nameChn: '售后订单',rules: ['require','gt:0'],errorMsg: {require: '售后订单错误',gt: '售后订单错误'},},
					{name: 'express_company_id',nameChn: '物流公司',rules: ['require','gt:0'],errorMsg: {require: '请选择物流公司',gt: "请选择物流公司"},},
					{name: 'express_no',nameChn: '物流单号',rules: ['require'],errorMsg: {require: '请填写物流单号'},},
					];
				if(!validate.check(data,rule)){
					uni.showToast({title: validate.getError()[0],icon:'none'});
					return ;
				}
				let page  = this;
				uni.showModal({
					title:"提示",
					content: "确认提交物流",
					success(res) {
						if(res.confirm){
							page.$core.post({url: 'xilumarket.aftersale/apply_express',data: data,loading: true,success: ret => {
								page.getOpenerEventChannel().emit("freightSuccess",{})
								uni.navigateBack({})
								uni.showToast({
									title:"物流提交成功"
								})
								
							},fail: err => {
								uni.showModal({
									title:'提示',
									content: err.msg,
									showCancel: false,
									success() {
										//uni.navigateBack()
									}
								})
								return false;
							}
							});
						}
					}
					
				})
				
			}
			
		}
    }
</script>

<style lang="scss" scoped>

</style>
